﻿<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>web worker fibonacci</title>
    <link href="../css/html5reset.css" rel="stylesheet" type="text/css" />
    <link href="../css/style.css" rel="stylesheet" type="text/css" />
    <link href="../css/main.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 9]>
<script src="html5.js"></script>
<![endif]-->

<script type="text/javascript">
    function withthread() {
        var worker = new Worker('fibonacci.js');
        worker.addEventListener('message', function (event) {
            var timer2 = (new Date()).valueOf();
            console.log('结果：' + event.data, '时间:' + timer2, '用时：' + (timer2 - timer));
            document.getElementById("result2").innerHTML = event.data + "，用时：" + (timer2 - timer);
        }, false);
        var timer = (new Date()).valueOf();
        console.log('开始计算：40', '时间:' + timer);
        setTimeout(function () {
            console.log('定时器函数在计算数列时执行了', '时间:' + (new Date()).valueOf());
        }, 1000);
        var x = document.getElementById("txtSeed").value;

        worker.postMessage(x);
        console.log('我在计算数列的时候执行了', '时间:' + (new Date()).valueOf());
    }
    function withjs() {
        var x = document.getElementById("txtSeed").value;
        var timer = (new Date()).valueOf();
        var result = fibonacci(x);
        var timer2 = (new Date()).valueOf();
        document.getElementById("result").innerHTML = result + "，用时：" + (timer2 - timer);
    }
    var fibonacci = function (n) {
        return n < 2 ? n : arguments.callee(n - 1) + arguments.callee(n - 2);
    };
    
  </script>
</head>
<body>
<header>
<h1>web worker fibonacci</h1>
</header>

<div>
fibonacci数列被以递归的方法定义：F0=0，F1=1，Fn=F(n-1)+F(n-2)（n>=2，n∈N*）
</div>
<p>
斐波纳契数列N:<input id="txtSeed" value="36" />
<input type="button" onclick="withjs();" value="Web js 36" />
<input type="button" onclick="withthread();" value="Web Worker 40" /></p>
<p><div id="result"></div>  </p>
<p><div id="result2"></div>  </p>
    <img src="../img/loading.gif" />

</body>
</html>